<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5" v-if="queryParams.estateId!=undefined">
        <router-link :to="'/property/estate/rooms?estateId='+queryParams.estateId" class="link-type">
          <el-button icon="el-icon-back" size="mini">
            返 回
          </el-button>
        </router-link>
      </el-col>
      <el-col :span="1.5">
        <router-link :to="'/property/fee/template?estateId=' + queryParams.estateId + '&roomId=' + queryParams.roomId + '&from=room'" class="link-type">
          <el-button icon="el-icon-back" size="mini">
            修改账单
          </el-button>
        </router-link>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" icon="el-icon" size="mini" :disabled="multiple" @click="handleUpdateState"
                   v-hasPermi="['module:feeOrderTemp:edit']">确认收费</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button size="mini" type="success" icon="el-icon" @click="kongzhi()"
                   v-hasPermi="['module:feeOrderTemp:edit']">设置折扣
        </el-button>
      </el-col>
    </el-row>

    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane v-for="type in yearList"
                   :label="type.yearNum"
                   :name="type.yearNum + ''" >
      </el-tab-pane>
      <el-tab-pane label="全部" name=0 >
      </el-tab-pane>
    </el-tabs>

    <el-table v-loading="loading" :data="templateList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="所属小区" align="center" prop="estateName" />
      <el-table-column label="姓名" align="center" prop="realName" />
      <el-table-column label="手机号" align="center" prop="phoneNum" width="110"/>
      <el-table-column label="户号" align="center" prop="roomNo" width="130"/>
      <el-table-column label="线下缴费时间" align="center" prop="payTime" width="250" v-if="this.queryParams.state==2"/>
      <el-table-column label="费用状态" align="center" prop="state" >
        <!--        0 - 未交费  1 - 已交费-->
        <template slot-scope="scope">
          <div>
            <el-tag v-if="scope.row.state === 0" style="cursor: pointer" :type="'warning'">未交费</el-tag>
            <el-tag v-if="scope.row.state === 1" style="cursor: pointer" :type="'success'">已交费</el-tag>
            <el-tag v-if="scope.row.state === 2" style="cursor: pointer" :type="'success'">线下交费</el-tag>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="是否车库" align="center" prop="state">
        <template slot-scope="scope">
          <div>
            <el-tag v-if="scope.row.isGarage === 0" style="cursor: pointer" :type="''">住宅</el-tag>
            <el-tag v-if="scope.row.isGarage === 1" style="cursor: pointer" :type="'success'">车库</el-tag>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="房屋类型" align="center" prop="roomType">
        <template slot-scope="scope">
          <div>
            <!--            房屋类型  0 - 高层 1 - 低层 2- 商业 3 - 别墅 4 - 其他-->
            <el-tag v-if="scope.row.roomType === 0" style="cursor: pointer" :type="''">高层</el-tag>
            <el-tag v-if="scope.row.roomType === 1" style="cursor: pointer" :type="''">低层</el-tag>
            <el-tag v-if="scope.row.roomType === 2" style="cursor: pointer" :type="''">商业</el-tag>
            <el-tag v-if="scope.row.roomType === 3" style="cursor: pointer" :type="''">别墅</el-tag>
            <el-tag v-if="scope.row.roomType === 4" style="cursor: pointer" :type="''">其他</el-tag>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="房屋面积"  v-if="queryParams.feeType === 'wyf'"  align="center" prop="roomArea">
        <template slot-scope="scope">
          <div>{{(scope.row.roomArea!=null ? scope.row.roomArea :'') +'㎡'}}</div>
        </template>
      </el-table-column>
      <el-table-column label="车牌号" v-if="queryParams.feeType === 'car'" align="center" prop="carNum" width="100"/>
      <el-table-column label="费用类型" align="center" prop="feeType" width="100">
        <!--        wyf - 物业费 rubbish - 垃圾处理费 car - 车位费  water - 水费 ，eletrict - 电费 ，jiaya - 加压费-->
        <template slot-scope="scope">
          <div>
            <el-tag v-if="scope.row.feeType === 'wyf'" style="cursor: pointer" :type="''">物业费</el-tag>
            <el-tag v-if="scope.row.feeType === 'rubbish'" style="cursor: pointer" :type="'success'">垃圾处理费</el-tag>
            <el-tag v-if="scope.row.feeType === 'car'" style="cursor: pointer" :type="'warning'">车位服务费</el-tag>
            <el-tag v-if="scope.row.feeType === 'water'" style="cursor: pointer" :type="'success'">代收水费</el-tag>
            <el-tag v-if="scope.row.feeType === 'jiaya'" style="cursor: pointer" :type="''">供水转换费</el-tag>
            <el-tag v-if="scope.row.feeType === 'eletrict'" style="cursor: pointer" :type="'warning'">代收电费</el-tag>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="费用时间" align="center" prop="yearNum" width="120">
        <template slot-scope="scope">
          {{ scope.row.yearNum +' 年' +  scope.row.monthNum +' 月' }}
        </template>
      </el-table-column>
      <el-table-column label="单价" align="center" prop="singlePrice">
        <template slot-scope="scope">
          <div>{{  (scope.row.singlePrice != null ? scope.row.singlePrice : 0.00) + '元'}}</div>
        </template>
      </el-table-column>
      <el-table-column label="总价" align="center" prop="totalPrice" width="120">
        <template slot-scope="scope">
          <div>{{ (scope.row.totalPrice != null ? scope.row.totalPrice : 0.00) + '元'}}</div>
        </template>
      </el-table-column>
      <el-table-column label="已支付金额" align="center" prop="paidPrice" width="120">
        <template slot-scope="scope">
          <div>{{(scope.row.paidPrice != null ? scope.row.paidPrice : 0.00) + '元'}}</div>
        </template>
      </el-table-column>
      <el-table-column label="优惠金额" align="center" prop="youhuiPrice">
        <template slot-scope="scope">
          <div>{{ (scope.row.youhuiPrice != null ? scope.row.youhuiPrice : 0.00) + '元'}}</div>
        </template>
      </el-table-column>
      <el-table-column label="数量"  align="center" prop="paidCount" width="80">
        <template slot-scope="scope">
          <div v-if="scope.row.feeType === 'car'">{{ scope.row.paidCount + '个' }}</div>
          <div v-else-if="scope.row.feeType === 'water'">
            {{ '起：' + scope.row.beginCount +'，止：' + scope.row.endCount + ',共'+scope.row.paidCount+'³' }}
          </div>
          <div v-else>{{ scope.row.paidCount }}</div>
        </template>
      </el-table-column>
      <el-table-column label="备注信息" align="center" prop="remark" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                     v-hasPermi="['module:feeOrderTemp:remove']">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

<!--    <pagination v-show="total > 0"-->
<!--                :total="total"-->
<!--                :page.sync="queryParams.pageNum"-->
<!--                :limit.sync="queryParams.pageSize"-->
<!--                @pagination="getList" />-->



    <!-- 添加或修改物业费相关费用的模板对话框 -->
    <el-dialog :title="titleState" :visible.sync="openState" width="550px" append-to-body>
      <el-form ref="form" :model="formState" :rules="rules" label-width="100px">
<!--        <el-form-item label="状态" prop="state">-->
<!--          <el-radio-group v-model="formState.state" size="mini">-->
<!--            <el-radio :value="0" :label="0" v-hasPermi="['module:feeOrderTemp:state']">未交费</el-radio>-->
<!--            <el-radio :value="1" :label="1">线上交费</el-radio>-->
<!--            <el-radio :value="2" :label="2">线下交费</el-radio>-->
<!--          </el-radio-group>-->
<!--        </el-form-item>-->
        <el-row style="margin-left: 30px" v-if="this.viewWyfSum!=0">
          <span style="font-size: 20px">物业费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewWyfSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.viewWaterSum!=0">
          <span style="font-size: 20px">供水费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewWaterSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.viewEletrictSum!=0">
          <span style="font-size: 20px">供电费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewEletrictSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.viewRubbishSum!=0">
          <span style="font-size: 20px">垃圾费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewRubbishSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.viewJiayaSum!=0">
          <span style="font-size: 20px">加压费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewJiayaSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.viewCarSum!=0">
          <span style="font-size: 20px">车位费金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewCarSum}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.account!=0&&accountOpen">
          <span style="font-size: 20px">账户内余额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.account}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.account-this.sum>=0&&this.account!=0&&accountOpen">
          <span style="font-size: 20px">抵扣后余额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewYue}}元</span>
        </el-row>
        <el-row style="margin-left: 30px" v-if="this.account-this.sum<=0&&this.account!=0&&accountOpen">
          <span style="font-size: 20px">需补缴金额：</span>
          <span style="font-size: 30px;color: #ff5722;">{{this.viewYue}}元</span>
        </el-row>
<!--        <el-row style="margin-left: 30px">-->
<!--          <span style="font-size: 20px">总缴费金额：</span>-->
<!--          <span style="font-size: 30px;color: #ff5722;">{{this.viewSum}}元</span>-->
<!--        </el-row>-->
        <el-row>
<!--          <el-form-item label="折扣力度" prop="discount" style="margin-top: 20px">-->
<!--            <el-input v-model="formState.discount" placeholder="请输入几折(如没有可不填或输入10)" size="mini" @change="zhekou"/>-->
<!--          </el-form-item>-->
          <el-form-item label="套内账户" prop="accountOpen">
            <el-radio-group v-model="accountOpen" size="mini">
              <el-radio :value="true" :label="true">使用</el-radio>
              <el-radio :value="false" :label="false">停用</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="缴费方式" prop="rechargeWay">
            <el-select v-model="formState.rechargeWay" placeholder="请选择缴费方式" filterable clearable
                       size="mini">
              <el-option label="现金缴费" :value="1"/>
              <el-option label="微信缴费" :value="2"/>
              <el-option label="刷卡缴费" :value="3"/>
              <el-option label="支付宝缴费" :value="4"/>
              <el-option label="预存抵扣" :value="5"/>
              <el-option label="转账支付" :value="6"/>
              <el-option label="多种付款" :value="7"/>
            </el-select>
          </el-form-item>
          <el-row>
            <el-col :span="20">
              <el-form-item label="备注信息" prop="remake">
                <el-input v-model="formState.remake" placeholder="请输入备注信息" size="mini"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" size="mini" type="primary" @click="submitFormState">确 定</el-button>
        <el-button @click="cancelState" size="mini">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog :title="title" :visible.sync="openKongzhi" width="400px" append-to-body>
      <el-form ref="form" :model="formVacant" :rules="rulesVacant" label-width="100px">
        <el-form-item label="开始时间" prop="vacantBeginDate">
          <el-date-picker
            v-model="formVacant.vacantBeginDate"
            type="month"
            value-format="yyyy-MM-dd"
            placeholder="选择日期时间"
            align="right">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间" prop="vacantBeginDate">
          <el-date-picker
            v-model="formVacant.vacantEndDate"
            type="month"
            value-format="yyyy-MM-dd"
            placeholder="选择日期时间"
            align="right">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="费用折扣" prop="count">
          <el-input v-model="formVacant.count" placeholder="折扣" style="width: 85%"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" size="mini" @click="submitVacant">确 定</el-button>
        <el-button @click="openKongzhi = false" size="mini">取 消</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import {
  listTemplate,
  getTemplate,
  delTemplate,
  addTemplate,
  updateTemplate,
  exportTemplate,
  importTemplateWyf,
  importTemplateSdJ,
  batchUpdateTemplate,
  offlineExportTemplate,
  NubTemplate,
  NubInfoTemplate,
  listYearList, batchUpdateAccountTemplate
} from "@/api/module/estate/wyfTemplate";
  import { getToken } from "@/utils/auth";
  import { listAllEstate } from "@/api/module/estate/estate";
import {getRoomAccount, listRoom, updateVacant} from "@/api/module/estate/room";

  export default {
    name: "Template",
    data() {
      return {
        activeName:"2024",
        // 按钮loading
        buttonLoading: false,
        // 遮罩层
        loading: true,
        // 导出遮罩层
        exportLoading: false,
        // 选中数组
        ids: [],
        //选中金额
        feeNum: [],
        youhui:[],
        //选中类型
        types:undefined,
        sum:0,
        //物业费总金额
        sumWyf:0,
        //水费总金额
        sumWater:0,
        //垃圾费总金额
        sumRubbish:0,
        //车位费总金额
        sumCar:0,
        //电费总金额
        sumEletrict:0,
        //加压总金额
        sumJiaya:0,
        //优惠总金额
        sumYouhui:0,
        //显示金额
        viewWyfSum:0,
        viewWaterSum:0,
        viewRubbishSum:0,
        viewEletrictSum:0,
        viewJiayaSum:0,
        viewCarSum:0,
        viewSum:0,
        viewYue:0,
        accountOpen:true,
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 物业费相关费用的模板表格数据
        templateList: [],
        estatesOptions:[],
        feeTypeOptions:[],

        // 弹出层标题
        title: "",
        titleState:"",
        titleRemark:'',
        yearList:[],
        queryYear:{
          estateId: undefined,
          roomId:undefined,
        },
        //该用户套内余额
        account:undefined,
        // 是否显示弹出层
        open: false,
        openState: false,
        openRemark: false,
        fromType:'',
        dateRange:[],
        xiugai:undefined,
        openKongzhi: false,
        formVacant: {
          vacantBeginDate: undefined,
          vacantEndDate: undefined,
          count:undefined,
          id: undefined,
          estateId:undefined,
        },
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 1000,
          estateId: undefined,
          roomId:undefined,
          realName: undefined,
          roomNo: undefined,
          feeType:undefined,
          state:0,
          yearNum:2024,
          isArrears:undefined,
          beginDate:undefined,
          endDate:undefined,
          type:undefined,
          xianshangBeginDate:undefined,
          xianshangEndDate:undefined,
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {
          rechargeWay: [
            {required: true, message: "缴费方式不能为空", trigger: "blur"}
          ],
        },
        rulesVacant: {
          vacantBeginDate: [
            {required: true, message: "请选择空置开始日期", trigger: "blur"}
          ],
          vacantEndDate: [
            {required: true, message: "请选择空置结束日期", trigger: "blur"}
          ],
          count: [
            {required: true, message: "请输入折扣", trigger: "blur"}
          ],
        },
        formState:{},
        formRemark:{
          ids: [],
          remark:undefined,
        },
      };
    },
    created() {
      console.log('section  this.$route.query',this.$route.query);
      this.queryParams.estateId = this.$route.query.estateId ? this.$route.query.estateId : undefined;
      this.formState.estateId = this.$route.query.estateId ? this.$route.query.estateId : undefined;
      this.queryParams.roomId = this.$route.query.roomId ? this.$route.query.roomId : undefined;
      this.queryYear.estateId = this.$route.query.estateId ? this.$route.query.estateId : undefined;
      this.queryYear.roomId = this.$route.query.roomId ? this.$route.query.roomId : undefined;
      this.formState.roomId = this.$route.query.roomId ? this.$route.query.roomId : undefined;
      // this.queryParams.isArrears = this.$route.query.arrears ? this.$route.query.arrears : undefined;
      this.fromType = this.$route.query.from ? this.$route.query.from : undefined;
      this.getList();
      this.getYearList();
      this.getAccount();
    },
    methods: {
      /** 查询物业费相关费用的模板列表 */
      getList() {
        this.getAccount();
        this.loading = true;
        console.log('this.queryParams', this.queryParams);
        listTemplate(this.queryParams).then(response => {
          this.templateList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      kongzhi() {
        this.kongzhiReset();
        this.openKongzhi = true;
        this.formVacant.estateId =  this.$route.query.estateId;
        this.formVacant.id = this.$route.query.roomId;
      },
      kongzhiReset() {
        this.formVacant = {
          vacantBeginDate: undefined,
          vacantEndDate: undefined,
          count: 10,
        }
      },
      submitVacant() {
        this.$refs["form"].validate(valid => {
          console.log(valid);
          if (valid) {
            updateVacant(this.formVacant).then(response => {
              this.msgSuccess("申请提交成功");
              this.openKongzhi = false;
              this.getList();
            }).finally(() => {
              this.buttonLoading = false;
            });
          } else {
            this.msgError("请填写后提交");
          }
        });
      },
      getAccount(){
        getRoomAccount(this.queryParams.roomId).then(response =>{
          this.account = parseFloat(response).toFixed(2);
          console.log(this.account)
        })
      },
      getEstateList() {
        listAllEstate().then(response => {
          this.estatesOptions = response.data;
        });
      },
      // 取消按钮
      cancel() {
        this.xiugai = undefined;
        this.open = false;
        this.reset();
      },
      // 取消按钮
      cancelState() {
        this.openState = false;
        this.resetState();
      },
      // 表单重置
      resetState() {
        this.formState = {
          ids: [],
          sum:0,
          viewSum:0,
          state: 2,
          discount:10,
          estateId:undefined,
          roomId:undefined,
          rechargeWay:undefined,
          remake:undefined,
        };
        this.resetForm("formState");
      },
      getYearList(){
        listYearList(this.queryYear).then(response =>{
          this.yearList=response.rows;
          console.log(response)
          console.log(this.yearList)
        })
      },
      handleClick(val){
        console.log('handleClick',val.name);
        this.activeName = val.name;
        this.queryParams.yearNum=this.activeName;
        this.getList();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id);
        this.feeNum = selection.map(item => item.totalPrice);
        this.youhui = selection.map(item => item.youhuiPrice);
        this.types = selection.map(item => item.feeType);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
        console.log("type:"+this.types)
        console.log("feeNum:"+this.feeNum)
        let doubleArray = [0];
        let doubleWyfArray = [0];
        let doubleCarArray = [0];
        let doubleWaterArray = [0];
        let doubleJiayaArray = [0];
        let doubleEletrictArray = [0];
        let doubleRubbishArray = [0];
        let doubleYouhuiArray = [0];
        let that = this;
        this.feeNum.forEach(str => {
          let num = parseFloat(str); // 使用parseFloat()函数将字符串转换为双精度
          if (!isNaN(num)) { // 确保转换结果不是非法的数字
            let relNum =  parseFloat(num).toFixed(2);
            doubleArray.push(num); // 添加到新的双精度数组中
          }
        });
        this.youhui.forEach(str => {
          let num = parseFloat(str); // 使用parseFloat()函数将字符串转换为双精度
          if (!isNaN(num)) { // 确保转换结果不是非法的数字
            let relNum =  parseFloat(num).toFixed(2);
            doubleYouhuiArray.push(num); // 添加到新的双精度数组中
          }
        });
        for(let i=0;i<=that.ids.length;i++){
          if (that.types[i] =="wyf"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            console.log("feeNum[i]:"+this.feeNum[i])
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleWyfArray.push(num); // 添加到新的双精度数组中
            }
          }
          if (that.types[i]==="water"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleWaterArray.push(num); // 添加到新的双精度数组中
            }
          }
          if (that.types[i]==="car"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleCarArray.push(num); // 添加到新的双精度数组中
            }
          }
          if (that.types[i]==="jiaya"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleJiayaArray.push(num); // 添加到新的双精度数组中
            }
          }
          if (that.types[i]==="eletrict"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleEletrictArray.push(num); // 添加到新的双精度数组中
            }
          }
          if (that.types[i]==="rubbish"){
            let num = parseFloat(that.feeNum[i]-that.youhui[i]); // 使用parseFloat()函数将字符串转换为双精度
            if (!isNaN(num)) { // 确保转换结果不是非法的数字
              let relNum =  parseFloat(num).toFixed(2);
              doubleRubbishArray.push(num); // 添加到新的双精度数组中
            }
          }
        }
        let relYouhuiNum = doubleYouhuiArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relWyfNum= doubleWyfArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relCarNum= doubleCarArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relJiayaNum= doubleJiayaArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relRubbishNum= doubleRubbishArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relEletrictNum= doubleEletrictArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        let relWaterNum= doubleWaterArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        this.sumWyf =  parseFloat(relWyfNum).toFixed(2);
        this.sumCar =  parseFloat(relCarNum).toFixed(2);
        this.sumJiaya =  parseFloat(relJiayaNum).toFixed(2);
        this.sumRubbish =  parseFloat(relRubbishNum).toFixed(2);
        this.sumEletrict =  parseFloat(relEletrictNum).toFixed(2);
        this.sumWater =  parseFloat(relWaterNum).toFixed(2);
        this.sumYouhui = parseFloat(relYouhuiNum).toFixed(2);
        // doubleArray.push(this.sumWyf);
        // doubleArray.push(this.sumCar);
        // doubleArray.push(this.sumJiaya);
        // doubleArray.push(this.sumRubbish);
        // doubleArray.push(this.sumEletrict);
        // doubleArray.push(this.sumWater);
        // console.log(doubleArray)
        let relNum= doubleArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        this.sum = parseFloat(relNum).toFixed(2);
      },
      //收费按钮
      handleUpdateState() {
        this.resetState();
        this.openState = true;
        this.titleState = "确认收费";
        this.viewWyfSum = this.sumWyf;
        this.viewJiayaSum = this.sumJiaya;
        this.viewCarSum = this.sumCar;
        this.viewEletrictSum = this.sumEletrict;
        this.viewRubbishSum = this.sumRubbish;
        this.viewWaterSum = this.sumWater;
        if(this.sumYouhui>0){
          this.viewYue =Math.abs(parseFloat(Number(this.account)+Number(this.sumYouhui)-Number(this.sum)).toFixed(2));
          console.log("sumYouhui:"+this.sumYouhui)
        }else {
          this.viewYue =Math.abs(parseFloat(this.account-this.sum).toFixed(2));
        }
        console.log("sum:"+this.sum)
        let doubleArray = [0];
        let num1 = parseFloat(this.viewWyfSum);
        let num2 = parseFloat(this.viewRubbishSum);// 使用parseFloat()函数将字符串转换为双精度
        let num3 = parseFloat(this.viewJiayaSum);
        let num4 = parseFloat(this.viewCarSum);
        let num5 = parseFloat(this.viewEletrictSum);
        let num6 = parseFloat(this.viewWaterSum);

        if (!isNaN(num1)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num1).toFixed(2);
          doubleArray.push(num1); // 添加到新的双精度数组中
        }
        if (!isNaN(num2)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num2).toFixed(2);
          doubleArray.push(num2); // 添加到新的双精度数组中
        }
        if (!isNaN(num3)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num3).toFixed(2);
          doubleArray.push(num3); // 添加到新的双精度数组中
        }
        if (!isNaN(num4)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num4).toFixed(2);
          doubleArray.push(num4); // 添加到新的双精度数组中
        }
        if (!isNaN(num5)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num5).toFixed(2);
          doubleArray.push(num5); // 添加到新的双精度数组中
        }
        if (!isNaN(num6)) { // 确保转换结果不是非法的数字
          let relNum =  parseFloat(num6).toFixed(2);
          doubleArray.push(num6); // 添加到新的双精度数组中
        }
        let relNum= doubleArray.reduce((accumulator, currentValue) => accumulator + currentValue);
        this.viewSum = parseFloat(relNum).toFixed(2);
        console.log("数值："+this.viewSum);
      },

      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            if (this.form.id != null) {
              updateTemplate(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addTemplate(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.xiugai = undefined;
                this.getList();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除物业费相关费用的模板编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.loading = true;
          return delTemplate(ids);
        }).then(() => {
          this.loading = false;
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {
        });
      },
      zhekou(){
        if (this.formState.discount!=0){
          this.viewWyfSum = parseFloat(this.sum * this.formState.discount /10).toFixed(2);
          let doubleArray = [0];
          let num1 = parseFloat(this.viewWyfSum);
          let num2 = parseFloat(this.viewRubbishSum);// 使用parseFloat()函数将字符串转换为双精度
          if (!isNaN(num1)) { // 确保转换结果不是非法的数字
            let relNum =  parseFloat(num1).toFixed(2);
            doubleArray.push(num1); // 添加到新的双精度数组中
          }
          if (!isNaN(num2)) { // 确保转换结果不是非法的数字
            let relNum =  parseFloat(num2).toFixed(2);
            doubleArray.push(num2); // 添加到新的双精度数组中
          }
          let relNum= doubleArray.reduce((accumulator, currentValue) => accumulator + currentValue);
          this.viewSum = parseFloat(relNum).toFixed(2);
        }else {
          this.viewWyfSum = this.sumWyf;
        }
      },
      submitFormState() {
        const ids = this.ids;
        this.formState.ids = ids;
        this.formState.state=2;
        this.formState.sum = this.sum;
        this.formState.viewSum = this.viewSum;
        this.formState.roomId = this.$route.query.roomId ? this.$route.query.roomId : undefined;
        if (this.formState.discount==undefined||this.formState.discount==0){
          this.formState.discount=10
        }
        console.log(this.formState)
        if(this.account!=0&&this.accountOpen){
          if (this.account-this.sum>=0){
            this.$confirm('是否确认全部抵扣?', "警告", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              this.loading = true;
              return batchUpdateAccountTemplate(this.formState);
            }).then(() => {
              this.loading = false;
              this.openState = false;
              this.getList();
              this.msgSuccess("缴费成功");
            }).catch(() => {});
          }else {
            this.$confirm('是否确认已收费"' + this.viewYue + '"元?', "警告", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              this.loading = true;
              return batchUpdateAccountTemplate(this.formState);
            }).then(() => {
              this.loading = false;
              this.openState = false;
              this.getList();
              this.msgSuccess("缴费成功");
            }).catch(() => {});
          }
        }else {
          this.$confirm('是否确认已收费"' + this.viewSum + '"元?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            this.loading = true;
            return batchUpdateTemplate(this.formState);
          }).then(() => {
            this.loading = false;
            this.openState = false;
            this.getList();
            this.msgSuccess("缴费成功");
          }).catch(() => {});
        }


        // batchUpdateTemplate(this.formState).then(response => {
        //   if (response.code === 200) {
        //     this.getList();
        //     this.openState = false;
        //     this.msgSuccess(response.msg);
        //   } else {
        //     this.msgError("修改失败");
        //   }
        // });


      },
      submitFormRemark() {
        const ids = this.ids;
        this.formRemark.ids = ids;
        console.log('this.formRemark', this.formRemark);
        batchUpdateTemplate(this.formRemark).then(response => {
          if (response.code === 200) {
            this.getList();
            this.openRemark = false;
            this.msgSuccess(response.msg);
          } else {
            this.msgError("修改失败");
          }
        });
      },
    }
  };
</script>
